<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>忘记密码</title>
    <link rel="stylesheet" type="text/css" href="__CSS__/api.css"/>
    <link rel="stylesheet" type="text/css" href="__CSS__/aui.css"/>
    <style>
    	body{
			background-color:#F8F8F8;
			/*padding-top:1.55rem;*/
    	}
    	.outer{
    		padding-left:18.5px;
    		padding-right:18.5px;
    		height:45px;
    		border-radius: 1px;
    		width:100%;
    	}
    	input[type=tel],
		input[type=password],
		input[type=text] {
			background:#FFFFFF ;
			margin: 0;
			/*color: #fff;*/
			font-size: 14px;
			height:45px;
			padding-left:23.5px;
			border-radius:0.1px;
		}
		input::-webkit-input-placeholder {
		    color:#B1B1B1;
		    font-size: 14px;
		}
		.code{
			margin-top:15px;
			margin-bottom:15px;
			border-top-right-radius: 0;
			border-bottom-right-radius: 0;
		}
		.send{
			/*width:34%;*/
			background-color: #F04040;
			color:#FFFFFF;
			font-size: 14px;
			line-height:46px;
			height:45px;
			text-align:center;
			border-top-right-radius:1px;
			border-bottom-right-radius:1px;
			padding-left:21.5px;
			padding-right:21.5px;
			display:inline-block;
		}
		.pwd{
            padding-right:10px;
            content: '';
            width:40px;
            height:45px;
            background: url('__IMG__/yanjing2.png') no-repeat center center;
            background-size: 0.95rem;
            background-color:#ffffff;
        }

		.showImggg{
            padding-right:10px;
            content: '';
            width:40px;
            height:45px;
            background: url('__IMG__/yanjing.png') no-repeat center center;
            background-size: 0.95rem;
            background-color:#ffffff;
        }

        .register{
        	height:47px;
        	margin-top:55px;
        	color:#FFFFFF;
        	font-size:16px;
					background: linear-gradient(-127deg,rgba(240,64,64,1),rgba(255,122,122,1));
					border-radius: 4px;
        	text-align:center;
        	line-height:47px;
        }

    </style>
</head>
<body>
<style>
	.aui-bar-nav{
		background:linear-gradient(-127deg,rgba(240,64,64,1),rgba(255,122,122,1));
		color:#fff;
	}
	.aui-iconfont {
		position: relative;
		font-family: "aui_iconfont" !important;
		font-size: 0.7rem;
		font-style: normal;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		height: 2.4rem;
	}

	.aui-icon-tu {
		height: 2.4rem;
		width: 49px;
		background: url('__IMG__/left1.png') no-repeat 0.5rem center;
		background-size: 10px 17.5px;
	}

	.aui-bar-nav .aui-pull-right {
		padding-right: 0.75rem;
	}

	.aui-bar-nav .aui-iconfont {
		position: relative;
		z-index: 20;
		font-size: 0.75rem;
		color: #2E82FF;
		line-height: 2.4rem;
	}
</style>
<header class="aui-bar aui-bar-nav underLine" style="margin-bottom:20px;">
	<a class="aui-pull-left" tapmode="active" onclick="window.history.back(-1);"> <span class="aui-iconfont aui-icon-tu"> </span> </a>
	<div class="aui-title">忘记密码</div>
	<!-- <a class="aui-pull-right">
               <span class="aui-iconfont" tapmode="active" onclick="right()">完成</span>
       </a>-->
</header>
	<div class="outer">
	<input type="tel" placeholder="请输入您绑定的手机号" maxlength="11" id="user_name"/>
	</div>
	<div class="outer code flex-wrap">
		<input class='flex-con' type="tel"  placeholder="请输入验证码"  id='codeValue' maxlength="6" placeholder="请输入验证码"/>
		<span class="send" id='code' onclick="need_ma()" tapmode="active">获取验证码</span>
	</div>
	<div class="outer flex-wrap">
		<div class="flex-con">
		<input type="password"  placeholder="请设置您的登录密码" minlength="6" maxlength="20"  id='user_pwd'/></div>
		<div class="showImggg" id="new_pwd" onclick="yanjing(this)" tapmode="active"></div>
	</div>
	<div class="outer">
	<div class="register" onclick="toRegister()" tapmode="active">确认</div>
	</div>

</body>
<script type="text/javascript" src="__JS__/jquery.min.js"></script>
<script type="text/javascript" src="__JS__/api.js"></script>
<script type="text/javascript" src="__JS__/tt.js"></script>
<script type="text/javascript">
	// 验证码获取
    	var isOnclick=true;
    	var yzm = true;
    	function need_ma(){
      	    var user_name = $('#user_name').val();
    		var regBox = {
    				regMobile: /^\d{11}$/ //手机
    		}
    		var rPhone = regBox.regMobile.test(user_name);
    		if (!(rPhone&&user_name)) {
    			 alert('请输入正确手机号');
    			return;
    		}
    		if(isOnclick && yzm){
                yzm = false;
    		//生成六位验证码
    		// var code4 = randomNmuber(0, 6);
    		//调用接口判断
    		sendSMS(user_name);
    		}else{
                alert('请稍等');
                return;
            }
    	}

			function sendSMS(phone){
                $.ajax({
                    url: '{:url("Login/getPhoneCode")}',
                    data: 'phone=' + phone + '&type=3',//
                    type: 'POST',
                    dataType: 'JSON',
                    success: function (data) {
                        if (data.status == '200') {
                            if (isOnclick) {
                                times = 59;
                                isinerval = setInterval("CountDown()", 1000);
                                isOnclick = false;
                            }
                        } else {
                            alert(data.msg)
                        }
                    },
                    error: function () {
                        alert('Ajax error!');
                    }
                })
			}
    	//验证码60秒倒数
    	function CountDown() {
    		 var code = $('#code');
    		 if (times < 1) {
                 $('#code').html('重新获取');
    				 clearInterval(isinerval);
    				 isOnclick=true;
    				 return;
    		 }
            $('#code').html('' + times + 's后重发');
    		 times--;
    	}

        //修改密码

    	function toRegister(){
    	    var user_name = $('#user_name').val();
    	    var code = $('#codeValue').val();
    	    var user_pwd = $('#user_pwd').val();

    		var regBox = {
    			regMobile: /^\d{11}$/ //手机
    		}

    		var regBox1 = {
    			regUpwd: /^[\da-zA-Z]{6,20}$/ //密码6-20位英文或数字
    		}

    		var rPhone = regBox.regMobile.test(user_name);
    		var rPwd = regBox1.regUpwd.test(user_pwd);

    		if (!(rPhone&&user_name)) {

    			 alert('请输入正确手机号');

    			return;

    		}else if(code==''){
    		  alert('请输入验证码');

    			return;
    		}else if(!rPwd){

    		   alert('请输入6-20位英文或数字');

    			return;

    		}else{
                $.ajax({
                    url: '{:url("Login/forgetPass")}',
                    data: 'phone=' + user_name + '&code=' + MD5(code) + '&newpass=' + user_pwd,//
                    type: 'POST',
                    dataType: 'JSON',
                    success: function (data) {
                        if (data.status == 200) {
                            location.href = '{:url("home/Index/index")}';
                        } else {
                            alert(data.msg)
                        }
                    },
                    error: function () {
                        alert('Ajax error!');
                    }
                })
			}
    	}
    // 显示隐藏密码
    function yanjing(el) {
        var user_pwd = $('#user_pwd').val();
        if ($(el).hasClass('pwd')) {
            $(el).removeClass('pwd');
            $(el).addClass('showImggg');
            document.getElementById("user_pwd").type="password";
        } else {
            $(el).removeClass('showImggg');
            $(el).addClass('pwd');
            document.getElementById("user_pwd").type="text";
        }
    }

</script>
</html>
